<template>
	<view class="record-detail page-content">
		<nav-bar back >{{ pageTitle }}</nav-bar>
		<view class="page-main page-main-content">
			<empty v-if="categoryList.length <= 0" />
			<uni-grid :column="3" :square="false" :showBorder="false" :highlight="false" @change="recordClick">
				<uni-grid-item v-for="(item, index) in categoryList" :index="index" :key="index">
					<view class="grid-item-box middleCenter">
						<category :type="item?.key" />
						<text class="text name">{{ item?.name }}</text>
						<text class="text total">共计: {{item.textTotal}}</text>
					</view>
				</uni-grid-item>
			</uni-grid>
		</view>
		
		
		
	</view>
</template>

<script setup>
	import { reactive, ref,shallowRef } from 'vue';
	import { onLoad,onReachBottom } from '@dcloudio/uni-app';
	import {recordList} from '@/utils/config.js'
	import dayjs from 'dayjs'
	import { getHistoryData,getDataByKey } from '@/utils/index.js'
	
	const queryParams = ref({})
	const allData = ref([])
	const pageTitle = ref('')
	
	const tabList = {
		now:{
			label:'今日统计'
		},
		'24':{
			label:'近24小时统计'
		},
		'48':{
			label:'近48小时统计'
		}
	}
	
	function recordClick(e){
		let {index} = e.detail
		let row =categoryList.value[index]
		uni.setStorageSync('timeLine',row)
		uni.navigateTo({
			url:'/pages/tabbar/tabbar-1/tabbarPage/timeLine'
		})
	}
	
	// 过滤出今天的记录 
	
	const todayData = (dataList,startTime,endTime)=>{
		let list = dataList.filter(item => {
		  let {updateTime} = item
		  if(!updateTime){
			  return false
		  }
		  
		  // console.log(updateTime < endTime,updateTime , startTime,endTime );
		  return updateTime >= startTime && updateTime <= endTime;
		});
		// console.log(list,'list',dataList);
		return  groupedData(list)
	}
	
	// 按 key 分组
	const groupedData = (dataList)=>{
		return dataList.reduce((acc, item) => {
		  if (!acc[item?.key]) {
			acc[item?.key] = [];
		  }
		  acc[item?.key].push(item);
		  return acc;
		}, {});
	}
	
	const categoryList = ref([])
	
	
	
	
	
	// 使用 onLoad 钩子函数
	onLoad((options) => {
	  console.log('页面加载时的参数:',options,options.type,recordList.map(item=>item?.key));
	  queryParams.value = options; // 将参数赋值给响应式变量
	  let obj = tabList[options.type]
	  pageTitle.value=tabList[options.type].label
	  allData.value = getHistoryData().filter(item=>{
		  return !['Sleep','Height','Weight','HeadCircumference','Others','Vaccination','Others'].includes(item.key)
	  })
	  let startDate,endDate
	  if(options.type === 'now'){
		startDate= dayjs(dayjs().startOf('day').format('YYYY-MM-DD HH:mm:ss')).valueOf();
		endDate= dayjs(dayjs().endOf('day').format('YYYY-MM-DD HH:mm:ss')).valueOf();
	  }else if(options.type == '24'){
		startDate= dayjs().subtract(24, 'hour').valueOf();
		endDate= dayjs().valueOf();
	  }else if(options.type == '48'){
		  startDate= dayjs().subtract(48, 'hour').valueOf();
		  endDate= dayjs().valueOf();
	  }
	 
	  
	  let pageData = todayData(allData.value,startDate,endDate);
	  // console.log(allData.value,startDate,endDate,pageData);
	  
	  
	  function getTotalText(key,list){
		  let text = ''
		  let item ={}
		switch (key){
			case 'Breastfeeding':
				text = `${list.length} 次`
				break;
			case 'MixedFeeding':
				text = list.reduce((prev,item)=>prev+ Number(item.actualMilkAmount),0) + ' 毫升'
				break;
			case 'FormulaMilk':
				text = list.reduce((prev,item)=>prev+ Number(item.actualMilkAmount),0) + ' 毫升'
				break;
			case 'NutritionalSupplements':
				text = `${list.length} 次`
				break;
			case 'WaterIntake':
				text = `${list.length} 次`
				break;
			case 'Pumping':
				text = `${list.length} 次`
				break;
			case 'DiaperChange':
				text = `${list.length} 次`
				break;
			case 'Pooping':
				text = `${list.length} 次`
				break;
			case 'Urination':
				text = `${list.length} 次`
				break;
			case 'SolidFood':
				text = `${list.length} 次`
				break;
			case 'Bathing':
				text = `${list.length} 次`
				break;
			case 'BodyTemperature':
				text = `${list.length} 次`
				break;
			case 'Discomfort':
				text = `${list.length} 次`
				break;
			case 'Medication':
				text = `${list.length} 次`
				break;
			default:
				break;
		}
		
		return text
	  }
	  
	  Object.keys(pageData).forEach(key=>{
		  let itemValue = pageData[key]
		  let keyData = getDataByKey(key)
		  let obj ={
			  ...keyData,
			  dataChildren:itemValue,
			  textTotal:getTotalText(key,itemValue)
		  }
		  categoryList.value.push(obj)
	  })
	  
	  
	  
	  // 获取当前时间
	  // const now = dayjs();
	  
	  // // 获取 24 小时之前的时间
	  // const twentyFourHoursAgo = now.subtract(24, 'hour');
	  
	  // // 格式化输出（可选）
	  // console.log('当前时间:', now.format('YYYY-MM-DD HH:mm:ss'));
	  // console.log('24 小时之前的时间:', twentyFourHoursAgo.format('YYYY-MM-DD HH:mm:ss'));
	});
	
	
	
	
</script>

<style lang="scss" scoped>
	.page-main-content{
		padding:  20rpx 10rpx;
	}
.grid-item-box{
	flex-direction: column;
	margin: 15rpx ;
	padding: 20rpx 0;
	box-shadow: 0 2rpx 12rpx 0 rgba(0, 0, 0, 0.1);
	border-radius: 10rpx;
	.name{
		font-size: 28rpx;
		margin: 15rpx 0;
	}
	.total{
		font-size: 24rpx;
	}
}
</style>
